<template>
    <div class="box">
        <p class="title">网页内容{{pageName}}</p>
        <el-form :model="list" status-icon ref="form" label-width="110px" :rules="rules">
            <el-form-item label="标题" prop="title">
                <el-input v-model="list.title"></el-input>
            </el-form-item>
            <el-form-item label="排序" prop="sorting">
                <el-input v-model.number="list.sorting"></el-input>
            </el-form-item>
            <!-- <el-form-item label="连接地址" v-if="list.type==3">
        <el-input v-model="list.link"></el-input>
      </el-form-item> -->
            <el-form-item label="是否首页展示" prop="isShow">
                <el-select v-model.number="list.isShow"  placeholder="请选择">
                    <el-option label="展示" :value="1"></el-option>
                    <el-option label="不展示" :value="2"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="状态" prop="status">
                <el-select v-model.number="list.status"  placeholder="请选择">
                    <el-option label="启用" :value="1"></el-option>
                    <el-option label="停用" :value="2"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item class="whole-handle-btn-box">
                <el-button type="primary" @click="handleCertain">确定</el-button>
                <router-link class="back-btn" to="index">
                    <el-button>返回</el-button>
                </router-link>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
export default {
    data() {
        return {
            list: {
            },
			pageName:'新增',
			pageType:1,
            rules: {
                title: { required: true, message: "标题不能为空", trigger: "change" },
                sorting: { required: true, message: "排序不能为空", trigger: "change" },
                status: { required: true, message: "状态不能为空", trigger: "change" },
                isShow: { required: true, message: "请选择是否需要展示", trigger: "change" }
            }
        };
    },
    created() {
		this.isAdd()
    },
    methods: {
		isAdd(){
			if(this.$route.query.type===2){
				this.list=this.$route.query.info;
				this.pageName='编辑';
			}else{
				this.pageName='新增';
			}
			this.pageType=this.$route.query.type;
		},
        // 确定添加导航
        handleCertain() {
            const _this = this;
            this.$refs.form.validate(bool => {
                if (bool) {
                    this.$confirm("您确定要添加么?", "提示", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    })
                        .then(() => {
                            this.$axios({
                                url: "admin/home/setContent",
                                data: {
									bodyID:_this.pageType===2?_this.list.id:'',
                                    title: _this.list.title,
                                    sorting: _this.list.sorting,
                                    status: _this.list.status,
                                    isShow:_this.list.isShow
                                },
                                success(res) {
                                    if (res.data.code === 200) {
                                        _this.$message({
                                            type: "success",
                                            message: res.data.msg
                                        });
										if(_this.pageType===2){
											_this.$router.go(-1);
										}else{
											_this.$refs.form.resetFields();
											_this.$refs.upload.clearFiles();
										}
                                    } else {
                                        _this.$message({
                                            type: "warning",
                                            message: res.data.msg
                                        });
                                    }
                                }
                            });
                        })
                        .catch(() => { });
                }
            });
        },
    }
};
</script>

<style scoped>
.box {
    padding: 30px;
    width: 100%;
}
.el-form {
    width: 50%;
    margin: 0 auto;
}
.title {
    margin-bottom: 20px;
    font-size: 20px;
    text-align: center;
}
.back-btn {
    margin-left: 10px;
}
#editor >>> .w-e-menu {
    padding: 0 8px;
}
</style>
